<!--
 * @Author: caihongtai caihongtai
 * @Date: 2025-02-09 14:03:11
 * @LastEditors: caihongtai caihongtai
 * @LastEditTime: 2025-03-30 20:45:42
 * @FilePath: /ai-interview-vue/src/views/Profile/resume/index.vue
 * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
-->
<template>
    <nav-bar title="我的简历" />
    <div class="resume-container">
        <common-list :request="fetchResumeList" :transform="transformData" ref="listRef" :show-finished-text="true"
            finished-text="已经到底啦～" empty-text="暂无简历" :showFinishedText="false">
            <template #default="{ list }">
                <van-radio-group v-model="checked" class="file-list">
                    <div v-for="item in list" :key="item.id" class="file-item" @click="handleSelect(item)">
                        <div class="file-info">
                            <!-- <van-icon name="description" size="24" color="#ee7b2d" class="file-icon" /> -->
                            <img src="/images/mine/resume/resume.png" alt="简历" class="file-icon" />
                            <div class="file-name-size">
                                <span class="file-name">{{ item.cv_name }}</span>
                                <span class="file-size">{{ item.size }}</span>
                            </div>
                        </div>
                        <div class="file-action">
                            <div class="file-action-item">
                                <van-radio :name="item.id" @click.stop="handleDefault(item)" />
                                <span>默认</span>
                            </div>
                            <van-button plain size="small" @click.stop="handleDelete(item)"
                                :disabled="list.length <= 1">
                                删除
                            </van-button>
                        </div>
                    </div>
                </van-radio-group>
            </template>

            <!-- 可选：自定义空状态 -->
            <template #empty>
                <van-empty description="暂无岗位">
                    <template #image>
                        <img src="/images/mine/resume/empty-resume.png" />
                    </template>
                    <template #default>
                        <div @click="handleUpload">
                            请先点击<span class="upload-text">添加岗位</span>
                        </div>
                    </template>
                </van-empty>
            </template>
        </common-list>
        <div class="upload-btn">
            <van-button block type="primary" @click="handleUpload">
                上传简历
            </van-button>
        </div>
    </div>
</template>

<script setup>
    const router = useRouter()
    import CommonList from '@/components/CommonList/index.vue'
    import { resumeApi } from '@/api/resume'
    import { showDialog } from 'vant'
    import emitter from '@/utils/eventBus'
    import NavBar from '@/components/NavBar/index.vue'

    const listRef = ref(null)
    const checked = ref(1)
    const currentRouteType = ref(null)

    // 获取简历列表
    const fetchResumeList = ({ pageNum, pageSize }) => {
        return resumeApi.getList({
            pageNum,
            pageSize
        })
    }

    // 数据转换
    const transformData = (data) => {
        console.log(data, "1212data")
        data.map(item => {
            if (item.default_status == 1) {
                checked.value = item.id
            }
        })
        return data
    }

    // 在组件挂载时加载数据
    onMounted(() => {
        if (router.currentRoute.value.query.type == 'create') {
            currentRouteType.value = 'create'
        }
        listRef.value?.reload()
    })

    // 删除处理
    const handleDelete = (file) => {
        showDialog({
            title: '确认删除',
            message: `是否删除文件 ${file.cv_name}？`,
            showCancelButton: true,
        }).then(() => {
            resumeApi.editResume({
                id: file.id,
                cv_name: file.cv_name,
                cv_url: file.cv_url,
                deleted: "1"//删除标识:0=未删除,1=已删除
            }).then(() => {
                listRef.value?.reload()
            })
        })
    }

    // 上传处理
    const handleUpload = () => {
        // 处理上传逻辑
        router.push({
            path: '/profile/resume/create',
            query: {
                type: 'create'
            }
        })
    }

    // 选择简历
    const handleSelect = (item) => {
        emitter.emit('update-info-status', item)
        // 后退
        router.back()
        // if (currentRouteType.value == 'create') {
        //     router.replace('/home')
        // } else {
        //     router.replace('/profile/resume')
        // }
    }

    // 设置默认简历
    const handleDefault = (item) => {
        console.log('handleDefault:', item)
        resumeApi.editResume({
            id: item.id,
            default_status: 1
        }).then(() => {
            listRef.value?.reload()
        })
    }
</script>

<style lang="scss" scoped>
    .resume-container {
        min-height: 100vh;
        background: #fff;

        :deep(.van-list) {
            margin-bottom: 80px;
        }
    }

    .file-list {
        padding: 16px;
        background-color: #fff;
        border-radius: 16px;
        margin-bottom: 16px;

        .file-item {
            display: flex;
            flex-direction: column;
            padding: 16px;
            background-color: #fff;
            border-radius: 16px;
            margin-bottom: 16px;
            border: 2px solid rgba(229, 230, 235, 1);

            .file-info {
                display: flex;
                align-items: center;

                .file-icon {
                    width: 36px;
                    height: 36px;
                    vertical-align: middle;
                }

                .file-icon {
                    margin-right: 8px;
                }

                .file-name-size {
                    display: flex;
                    flex-direction: column;
                }

                .file-name {
                    font-size: 17px;
                    font-weight: 500;
                    margin-right: 8px;
                    color: rgba(29, 33, 41, 1);

                }

                .file-size {
                    font-size: 14px;
                    font-weight: 400;
                    color: #999;
                }
            }

            .file-action {
                display: flex;
                align-items: center;
                justify-content: space-between;
                margin-top: 10px;

                .file-action-item {
                    display: flex;
                    align-items: center;
                    justify-content: center;
                }

                .van-radio {
                    margin-right: 8px;
                }

                .van-button {
                    border-radius: 8px;
                    background: rgba(242, 243, 245, 1);
                    color: rgba(29, 33, 41, 1);
                    font-size: 14px;
                    width: 60px;
                    height: 28px;

                }
            }
        }
    }

    .upload-btn {
        position: fixed;
        bottom: 20px;
        left: 16px;
        right: 16px;

        .van-button {
            background: rgb(242, 243, 245);
            color: rgba(29, 33, 41, 1);
            border: none;
        }
    }

    .van-empty__bottom {
        .upload-text {
            color: rgba(22, 93, 255, 1);
        }
    }
</style>